<template>
  <div class="home d-flex flex-column my-container">
<!-- 
    <el-form :model="searchModel" :inline="true">
      <el-form-item>
        <el-input v-model="searchModel.userName" :disabled="detailsDisabled" placeholder="请输入菜单名称"
          prefix-icon="el-icon-search" />
      </el-form-item>
      <el-form-item>
       
      </el-form-item>
    </el-form>
 -->

    <div class="col d-flex flex-column shadow p-3 rounded-lg">
			<div class="mb-3">
				<el-button type="success" icon="el-icon-refresh" @click="getList">
				  刷新</el-button>
			</div>
      <div class="col d-flex over-auto">
        <el-table v-loading="isLoading" :data="tableData"  row-key="id" border height="100%" ref="tableRef">
          <el-table-column type="index" label="序号" width="100" align="center" />
          <el-table-column prop="menuName" label="菜单名称" align="center" />
          <el-table-column prop="createBy" label="菜单描述" align="center" />
          <el-table-column label="创建时间" align="center" prop="createTime">
            <template slot-scope="scope">
              {{ scope.row.createTime }}
            </template>
          </el-table-column>
        </el-table>

      </div>
    </div>
  </div>
</template>

<script>
  import {
    queryAllMenu
  } from "@/api/userControl/menuControl"
  export default {
    data() {
      return {
        searchModel: {},
        tableData: [],
		isLoading:false
      }
    },
    created() {
      this.getList()
    },
    mounted() {},
    methods: {
      refresh() {
        this.getList()
      },
      async getList() {
		  this.isLoading = true
        const {
          object
        } = await queryAllMenu()
        if (object) {
          this.tableData = object
          // this.total = object.count
		  this.isLoading = false
        }
      }
    }
  }
</script>

<style scoped lang="scss"></style>